<template>
    <el-dialog
        :visible.sync="visible"
        :title="$t('process.deployFile')"
        :close-on-click-modal="false"
        :close-on-press-escape="false">
        <el-upload
            :action="url"
            :file-list="fileList"
            :before-upload="beforeUploadHandle"
            :on-success="successHandle"
            name="processFile"
            drag
            class="text-center">
            <i class="el-icon-upload"/>
            <div
                class="el-upload__text"
                v-text="$t('upload.text')"/>
            <div
                slot="tip"
                class="el-upload__tip">
                {{ $t('upload.tip', { 'format': 'zip、xml、bar、bpmn' }) }}
            </div>
        </el-upload>
    </el-dialog>
</template>

<script>
import Cookies from 'js-cookie';
export default {
    data() {
        return {
            visible: false,
            url: '',
            fileList: []
        };
    },
    methods: {
        init() {
            this.visible = true;
            this.url = `${window.SITE_CONFIG['apiURL']}/act/process/deploy?token=${Cookies.get('token')}`;
            this.fileList = [];
        },
        // 上传之前
        beforeUploadHandle(file) {
            if (!/.+\.zip$/.test(file.name) && !/.+\.xml$/.test(file.name) && !/.+\.bar$/.test(file.name) && !/.+\.bpmn$/.test(file.name)) {
                this.$message.error(this.$t('upload.tip', { 'format': 'zip、xml、bar、bpmn' }));
                return false;
            }
        },
        // 上传成功
        successHandle(res) {
            if (res.code !== 0) {
                return this.$message.error(res.msg);
            }
            this.$message({
                message: this.$t('prompt.success'),
                type: 'success',
                duration: 500,
                onClose: () => {
                    this.visible = false;
                    this.$emit('refreshDataList');
                }
            });
        }
    }
};
</script>
